Flutter-Android开发者文档 - 手势检测及触摸事件处理
By Bask on null
喜欢我的小伙伴,一定要关注我的微信公众号啊!!!谢谢啦
AllAboutCoding
此文章为翻译Flutter官网的Flutter for Android Developers - Gesture detection and touch event handling有兴趣的小伙伴可以移步官网查看。
手势检测及触摸事件处理
在Flutter中如何给Widget添加点击事件监听?
Widget的手势事件如何处理?
使用** GestureDetector**,你可以监听大部分手势,例如:
-
点击
- onTapDown 指针在屏幕的某个地方接触产生点击
- onTapUp 指针在屏幕的某个地方触发点击
- onTap 点击已发生
- onTapCancel
-
双击
- onDoubleTap 用户在同一个地方连续点击两下
-
长按
- onLongPress 指针在同一位置长时间与屏幕接触
-
垂直拖拽
- onVerticalDragStart 指针已经接触屏幕,并且可能垂直移动。
- onVerticalDragUpdate 指针已经接触屏幕并且进一步垂直移动。
- onVerticalDragEnd 指针之前与屏幕接触并在屏幕上垂直移动,停止与屏幕接触时以一个特定的速度。
-
水平拖拽
- onHorizontalDragStart 指针已经接触屏幕,并且可能水平移动。
- onHorizontalDragUpdate 指针已经接触屏幕并且进一步水平移动。
-
onHorizontalDragEnd 指针之前与屏幕接触并在屏幕上水平移动,停止与屏幕接触时以一个特定的速度。 下面的例子展示了使用GestureDetector双击后旋转Flutter Logo:
AnimationController controller; CurvedAnimation curve;
@override void initState() { controller = new AnimationController(duration: const Duration(milliseconds: 2000), vsync: this); curve = new CurvedAnimation(parent: controller, curve: Curves.easeIn); }
class SampleApp extends StatelessWidget { @override Widget build(BuildContext context) { return new Scaffold( body: new Center( child: new GestureDetector( child: new RotationTransition( turns: curve, child: new FlutterLogo( size: 200.0, )), onDoubleTap: () { if (controller.isCompleted) { controller.reverse(); } else { controller.forward(); } }, ), )); } }